<template lang="">
    <div >
    <van-nav-bar
  title="登录"
/>
     <van-form @submit="donLogin">
  <van-field
    v-model="mobile"
    name="mobile"
    label="手机号"
    placeholder="请输入手机号"
    :rules="rules.mobile"
  />
  <van-field
    v-model="code"
    type="password"
    name="code"
    label="验证码"
    placeholder="请输入验证码"
    :rules="rules.code"
  />
  <div style="margin: 16px;">
    <van-button :loading="isLoading" loading-text="登录中..." round block type="info" native-type="submit">提交</van-button>
  </div>
</van-form>
    </div>
</template>
<script>
import {loginAPI} from '@/api'
// import {setToken} from '@/utils/auth'
export default {
      data() {
    return {
     mobile: '15677921363',
     code: '246810',
     isLoading: false,
     rules:{
         mobile:[
           { required: true, message: '请填写手机号' },
           {pattern:/^1[2-9]\d{9}$/, message:'请填写手机号',taigger:'onBlur'}

         ],
         code: [
             { required: true, message: '请填写验证码' },
             {pattern:/^\d{6}$/,message: '请填写6位数字验证码'}

         ]
     }

    };
  },
  methods: {
    // donLogin(data) {
    // this.isLoading=true
    //  loginAPI(data)
    //  .then(()=>{
    //     this.$toast.success('登录成功')
    //  })
    //  .catch(()=>{
    //      this.$toast.fail('登录失败')
    //  })
    //  .finally(()=>{
    //      this.isLoading=false
    //  })
    // },


    //使用async 与 await
    async donLogin(data) {
      this.isLoading=true
      try{
        let res = await loginAPI(data)
          //  console.log(res);
           this.$toast.success('登录成功')
          // setToken(res.data.data)
          this.$store.commit('saveToken',res.data.data)
        //  console.log(res);
        if(this.$route.query.back){
          this.$router.push(this.$route.query.back)
        }else{
             this.$router.push("/layout/home")
        }
      }
      catch{
        this.$toast.fail('登录失败')
      }
      this.isLoading=false
    }
  },
    
}
</script>
<style lang="">
    
</style>